<template>
  <div class="home" style="width: 100%;height:100%;">
    <Dingbu :nameTitle="PageName"></Dingbu>
    <div class="account">
      <!-- <div class="tip">
        <span class="tab">
          <Button class="addBtn">本周</Button>
          <Button class="addBtn">本月</Button>
        </span>
        <DatePicker type="daterange" style="" show-week-numbers placement="bottom-end" placeholder="请选择时间"></DatePicker>
      </div> -->
      <Table size="large" :columns="columns2" :data="data2" style="margin-top:10px;"></Table>
      <Page style="float:right;margin:8px 15px 0 0;" :total="10" show-elevator></Page>
    </div>
  </div>
</template>
<script>
import Dingbu from "../header/dingbu.vue";
import { mapGetters, mapMutations, mapActions } from "vuex";
export default {
  data() {
    return {
      PageName: "商品统计",
      data2: [],
      columns2: [
        {
          title: '排序',
          align: 'center',
          key: 'name'
        },
        {
          title: '商品名称',
          align: 'center',
          key: 'age'
        },
        {
          title: '销量',
          align: 'center',
          key: 'name'
        },
        {
          title: '价格(元)',
          align: 'center',
          key: 'age'
        },
        {
          title: '库存',
          align: 'center',
          key: 'name'
        }
      ]
    };
  },
  mounted() {
  },
  components: {
    Dingbu
  },
  methods: {
    ...mapActions(["checkAccountsIndex"])
  },
  created() {
    this.$store.dispatch("checkAccountsIndex", "shopAccount")
  }
};
</script>
<style lang="scss" scoped>
@import "../../css/common.scss";
.do{
  padding: 8px 15px;
  >.tip{
    font: 16px/24px "";
    color: #444;
    padding: 8px 9px;
  }
}
.account{
  padding: 8px 1px;
  >.tip{
    overflow: hidden;
    font: 16px/48px "";
    color: #444;
    padding: 8px 9px;
    width: 100%;
    >.tab{
      display: inline-block;
      margin: 0 auto;
    }
  }
}
</style>

